<template>
  <div class="content">
    <div class="headerTitle">湖州市一厂多租监管平台</div>
    <div class="topBtn">
      <div class="letBtn">通知消息</div>
      <div class="rightBtn" @click="skipPageChang">数据大屏</div>
    </div>
    <div class="midBtn">
      <div class="midBtnCommon zongqiu" @click="skipPage"></div>
      <div class="midBtnCommon changqiu"></div>
      <div class="midBtnCommon jiqiu" @click="skipPageJicheng"></div>
      <div class="midBtnCommon changzhongchangqiu" @click="skipPageHezu"></div>
    </div>
    <div class="midText">
      <div class="commentText zongText">综合场景</div>
      <div class="commentText yiText">厂房租赁</div>
      <div class="commentText jiText">基层应消</div>
      <div class="commentText changText">合租监管</div>
    </div>
    <div class="loginOut" @click="loginOut"></div>
  </div>
</template>

<script>
export default {
  name: 'indexPage',
  props: {},
  components: {},
  data() {
    return {}
  },
  methods: {
    skipPage() {
      this.$router.push('/comprehensiveScene')
    },
    skipPageChang() {
      this.$router.push('/rentMoreFactory')
    },
    skipPageJicheng() {
      window.open('http://220.191.216.184:8443/', '_blank')
    },
    skipPageHezu() {
      window.open(
        'https://xwyq.yjt.zj.gov.cn:9443/#/multiterminal/zf/fxgk/oneFigure',
        '_blank'
      )
    },
    loginOut() {
      this.$store.commit('user/delToken')
      localStorage.removeItem('roleList')
      this.$router.push('/login')
    },
  },
  created() {
    if (!this.$store.getters.token) {
      this.$router.push('/login')
    }

  },
  mounted() {},
  watch: {},
  computed: {},
  filters: {},
}
</script>

<style scoped lang="scss">
.content {
  width: 1920px;
  height: 1080px;
  position: relative;
  background-image: url('@/assets/common/组 48202@1x.png');
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  .loginOut {
    position: absolute;
    left: 20px;
    top: 8px;
    background-image: url('@/assets/login/Btn-Back@1x.png');
    width: 111px;
    height: 36px;
  }
  .headerTitle {
    background-image: url('@/assets/common/headIndex.png');
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    box-sizing: border-box;
    width: 1920px;
    height: 79px;
    text-align: center;
    padding-top: 9px;
    font-size: 40px;
    letter-spacing: 0.2em;
    font-feature-settings: 'kern' on;
    text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.35);
    color: #fff;
    font-weight: bold;
    position: absolute;
    left: 0;
    top: 0;
  }
  .topBtn {
    font-family: Source Han Sans;
    font-size: 16px;
    font-weight: bold;
    line-height: normal;
    letter-spacing: 0em;
    font-feature-settings: 'kern' on;
    color: #ffffff;
    .letBtn {
      position: absolute;
      top: 35px;
      left: 467px;
      width: 114px;
      height: 30px;
      background-image: url('@/assets/common/lelt.png');
      padding-top: 6px;
      padding-left: 24px;
      box-sizing: border-box;
    }
    .rightBtn {
      cursor: pointer;
      position: absolute;
      top: 35px;
      left: 1342px;
      width: 114px;
      height: 30px;
      background-image: url('@/assets/common/right.png');
      padding-top: 6px;
      padding-left: 24px;
      box-sizing: border-box;
    }
  }
  .midBtn {
    .midBtnCommon {
      width: 280px;
      height: 276px;
      background-size: cover;
      background-repeat: no-repeat;
      position: absolute;
      cursor: pointer;
    }
    .zongqiu {
      top: 295px;
      left: 332px;
      // background-image: url('@/assets/common/组 48192@1x.png');
    }
    .changqiu {
      top: 492px;
      left: 661px;
      // background-image: url('@/assets/common/组 48192@1x.png');
    }
    .jiqiu {
      height: 291px;
      top: 374px;
      left: 1027px;
      // background-image: url('@/assets/common/组 48200@1x.png');
    }
    .changzhongchangqiu {
      top: 489px;
      left: 1404px;
      // background-image: url('@/assets/common/组 48201@1x.png');
    }
  }
  .midText {
    .commentText {
      position: absolute;
      // writing-mode: vertical-rl;
      font-family: Source Han Sans;
      font-size: 30px;
      font-weight: bold;
      line-height: normal;
      letter-spacing: 0.3em;
      font-feature-settings: 'kern' on;
      color: #ffffff;
      text-shadow: 0px 1px 8px rgba(0, 0, 0, 0.55);
    }
    .zongText {
      top: 564px;
      left: 324px;
    }
    .yiText {
      top: 716px;
      left: 695px;
    }
    .jiText {
      top: 551px;
      left: 1060px;
    }
    .changText {
      top: 712px;
      left: 1431px;
    }
  }
}
</style>
